import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_smart_heating/common/app.dart';
import 'package:flutter_smart_heating/common/global.dart';
import 'package:flutter_smart_heating/common/http.dart';
import 'package:flutter_smart_heating/ui/ui.dart';

class UserStationPicker extends StatefulWidget {
  const UserStationPicker({
    super.key,
    this.value,
    this.onConfirm,
  });
  final dynamic value;
  final Function(Map<String, dynamic> item)? onConfirm;
  static show(
    context, {
    dynamic value,
    Function(Map<String, dynamic> item)? onConfirm,
  }) {
    showModalBottomSheet(
      context: context,
      builder: (context) {
        return UserStationPicker(
          value: value,
          onConfirm: onConfirm,
        );
      },
    );
  }

  @override
  State<UserStationPicker> createState() => _UserStationPickerState();
}

class _UserStationPickerState extends State<UserStationPicker> {
  bool loading = true;
  int selectIndex = 0;
  @override
  void initState() {
    super.initState();
  }

  getSelectIndex() {
    selectIndex = GlobalData.substation.indexWhere(
      (element) => element['value'] == widget.value,
    );
  }

  fetchData() async {
    var res = await Http.instance.post('/api/substation/index/selection');
    if (res.code == 1) {
      loading = false;
      GlobalData.substation = res.data;
      getSelectIndex();
    }
    setState(() {});
  }

  @override
  Widget build(BuildContext context) {
    return UiLifeCycle(
      onRouteDone: () {
        loading = GlobalData.substation.isEmpty;
        if (!loading) {
          getSelectIndex();
          setState(() {});
        }
        fetchData();
      },
      child: SafeArea(
        bottom: true,
        top: false,
        minimum: const EdgeInsets.only(bottom: 20),
        child: SizedBox(
          width: double.infinity,
          height: 300,
          child: loading
              ? const CupertinoActivityIndicator()
              : Padding(
                  padding: const EdgeInsets.symmetric(horizontal: 5),
                  child: Column(
                    children: [
                      AppBar(
                        toolbarHeight: 50,
                        leadingWidth: 63,
                        backgroundColor: Colors.transparent,
                        leading: Center(
                          child: TextButton(
                              onPressed: () {
                                App.back(context);
                              },
                              child: const Text(
                                '取消',
                                style: TextStyle(
                                  fontWeight: FontWeight.bold,
                                  color: Colors.grey,
                                ),
                              )),
                        ),
                        title: const Text('选择分区'),
                        actions: [
                          TextButton(
                              onPressed: () {
                                App.back(context);
                                var item = GlobalData.substation[selectIndex];
                                widget.onConfirm?.call(item);
                              },
                              child: const Text(
                                '确定',
                                style: TextStyle(
                                    fontWeight: FontWeight.bold,
                                    color: UiTheme.primary),
                              ))
                        ],
                      ),
                      const Divider(
                        height: 0,
                        thickness: 0.3,
                      ),
                      Expanded(
                        child: Padding(
                          padding: const EdgeInsets.symmetric(horizontal: 5),
                          child: CupertinoPicker.builder(
                            scrollController: FixedExtentScrollController(
                              initialItem: selectIndex,
                            ),
                            itemExtent: 40,
                            childCount: GlobalData.substation.length,
                            onSelectedItemChanged: (val) {
                              selectIndex = val;
                            },
                            squeeze: 1.1,
                            itemBuilder: (context, index) {
                              return Center(
                                child: Text(
                                  GlobalData.substation[index]['label'],
                                ),
                              );
                            },
                          ),
                        ),
                      ),
                      // Opacity(
                      //   opacity: 0.9,
                      //   child: Padding(
                      //     padding: const EdgeInsets.symmetric(horizontal: 10),
                      //     child: Row(
                      //       children: [
                      //         Expanded(
                      //           child: UiButton(
                      //             outline: true,
                      //             child: const Text('取消'),
                      //             onPressed: () {
                      //               App.back(context);
                      //             },
                      //           ),
                      //         ),
                      //         const SizedBox(width: UiTheme.spacingX),
                      //         Expanded(
                      //           child: UiButton(
                      //             child: const Text(
                      //               '确定',
                      //               style: TextStyle(color: Colors.white),
                      //             ),
                      //             onPressed: () {
                      //               App.back(context);
                      //               var item = GlobalData.substation[selectIndex];
                      //               widget.onConfirm?.call(item);
                      //             },
                      //           ),
                      //         ),
                      //       ],
                      //     ),
                      //   ),
                      // )
                    ],
                  ),
                ),
        ),
      ),
    );
  }
}
